<template>
  <div style="display: flex; margin-top: 20px" v-if="isshow">
    <div style="margin-right: 30px">双人双锁</div>
    <div v-for="item in swipe" :key="item.id"
      style="display: flex; align-items: center; flex-direction: column; margin-right: 20px; width: 80px; height: 100px">
      <svg v-if="item.status == 0" t="1683357485983" class="icon" viewBox="0 0 1024 1024" version="1.1"
        xmlns="http://www.w3.org/2000/svg" p-id="5095" width="40" height="40">
        <path
          d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0zM213.333 832A298.667 298.667 0 0 1 512 533.333a170.667 170.667 0 1 1 170.667-170.666A170.667 170.667 0 0 1 512 533.333 298.667 298.667 0 0 1 810.667 832z"
          fill="#cdcdcd" p-id="5096"></path>
      </svg>
      <svg v-else-if="item.status == 1" t="1683357485983" class="icon" viewBox="0 0 1024 1024" version="1.1"
        xmlns="http://www.w3.org/2000/svg" p-id="5095" width="40" height="40">
        <path
          d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0zM213.333 832A298.667 298.667 0 0 1 512 533.333a170.667 170.667 0 1 1 170.667-170.666A170.667 170.667 0 0 1 512 533.333 298.667 298.667 0 0 1 810.667 832z"
          fill="#1afa29" p-id="5096"></path>
      </svg>
      <svg v-else t="1683357485983" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
        p-id="5095" width="40" height="40">
        <path
          d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0zM213.333 832A298.667 298.667 0 0 1 512 533.333a170.667 170.667 0 1 1 170.667-170.666A170.667 170.667 0 0 1 512 533.333 298.667 298.667 0 0 1 810.667 832z"
          fill="#fa3a3a" p-id="5096"></path>
      </svg>
      <p style="margin-bottom: 0">{{ item.name }}</p>
      <p style="color: red" v-if="item.status == 2">人员不正确</p>
    </div>
  </div>
</template>

<script setup lang="tsx">
import { ref, defineExpose } from 'vue';
import MQTT from '@/framework/utils/mqtt';
import { message } from 'ant-design-vue';
import { searchDevice } from '@/api/emq-openapi';
import { userList } from '@/api/user-data';
import { userSearch } from '@/api/operationFlow';
const props = defineProps({
  type: { type: Number, default: 0 },
});

const swipe = ref([
  { id: 123456, name: '操作人', status: 0 },
  { id: 1234567, name: '操作人', status: 0 },
]);
let mokedata = [];
const isshow = ref(true);
const disbun = ref(true);
let mokedata2 = 0;
let keys: any = [];
let username = '';
const equipmentSow = ref([]);
const NumberEquipment = async () => {
  const {
    result: { auditManageEntity },
  } = await userSearch({ type: props.type, specimenList: [1, 2, 3] });
  if (!auditManageEntity?.manageLinkList) {
    isshow.value = false;
    return (disbun.value = false);
  }
  mokedata = auditManageEntity.manageLinkList[0].auditUserId.split(',');
  mokedata2 = auditManageEntity.manageLinkList[0].auditType;
  let { data } = await searchDevice([]);
  let devices = data.filter((item) => item.connected && item.clientid && item.clientid.startsWith('card'));
  if (devices.length === 0) {
    message.warning('未检测到刷卡机');
  } else if (devices.length === 1) {
    let queryparams: any = {
      pageSize: 1000,
      pageNum: 1,
      orderBy: [
        {
          field: 'createTime',
          order: 'desc',
        },
      ],
      paging: false,
    };
    let { result } = await userList(queryparams);
    result.forEach((item) => {
      keys.push({
        id: item.identityCode,
        name: item.name,
      });
    });
    if (equipmentSow.value.length > 0) MQTT.unsubscribe('bims/card/' + `${equipmentSow.value[0].sn}` + '/tagReport');
    equipmentSow.value = [{ sn: devices[0].clientid.split('_')[1] }];
    MQTT.publish('bims/card/' + `${equipmentSow.value[0].sn}` + '/open', '10');
    MQTT.subscribe('bims/card/' + `${equipmentSow.value[0].sn}` + '/tagReport', 0);
    MQTT.$on('mqtt-msg', (res) => {
      let obj = JSON.parse(res.msg.toString());
      let exist = swipe.value.filter((item) => item.status != 0);
      if (exist.length == 2) return message.warning('请稍后再试');
      let arr = keys.filter((item) => item.id == obj.tags[0].epc);
      if (arr.length == 0) return message.warning('身份信息无法识别');
      //按顺序刷卡
      if (mokedata2 == 0) {
        if (obj.tags[0].epc == mokedata[0]) {
          for (let i = 0; i < swipe.value.length; i++) {
            if (swipe.value[i].status != 1) {
              mokedata.shift();
              swipe.value[i] = { ...arr[0], status: 1 };
              seebunStatus();
              return;
            }
          }
        } else {
          fail(arr[0]);
        }
      } else {
        if (mokedata.filter((item) => item == obj.tags[0].epc).length > 0) {
          for (let i = 0; i < swipe.value.length; i++) {
            if (swipe.value[i].status != 1) {
              swipe.value[i] = { ...arr[0], status: 1 };
              mokedata.splice(
                mokedata.findIndex((item) => item == obj.tags[0].epc),
                1,
              );
              if (mokedata2 == 2) {
                disbun.value = false;
              } else {
                seebunStatus();
              }
              return;
            }
          }
        } else {
          fail(arr[0]);
        }
      }
    });
  }
};
// 刷卡失败
const fail = (data) => {
  for (let i = 0; i < swipe.value.length; i++) {
    if (swipe.value[i].status != 1) {
      setTimeout(() => {
        for (let i = 0; i < swipe.value.length; i++) {
          if (swipe.value[i].status == 2) return (swipe.value[i] = { id: 123456, name: '操作人', status: 0 });
        }
      }, 2000);
      return (swipe.value[i] = { ...data, status: 2 });
    }
  }
};
NumberEquipment();
//查询按钮状态
const seebunStatus = () => {
  disbun.value = !swipe.value.every((item) => item.status == 1);
};
defineExpose({
  disbun,
  username,
  swipe,
});
</script>

<style lang="less" scoped></style>
